/* This is a UI control. It takes the template, model data
 * and returns HTML code representing a single node
 * in a list
 */
define( [ 
		'underscore', 
		'jquery',
		'backbone',
		'text!templates/bookView.html' 
	  	], 
function( _, $, Backbone, bookHTML ) {
	var BookView = Backbone.View.extend({
		tagName:"div",

		className:"bookContainer",

 		// template: $("#bookTemplate").html(),
	
	 	render:function() {
			//	var tmpl = _.template(this.template);
			// This is the classic way adding an template into a View
			// the view definition is inside the index.html.
		
			var tmpl = _.template( bookHTML );
			//	and this is the approach possibile with the plugin "text"
			//	for requirejs. The template is stored inside an extra file.
			
			this.$el.html(tmpl(this.model.toJSON()));
			return this;
		},

		deleteBook:function(e) {
			console.log(e);
			this.model.destroy();
			this.remove();
		},

		events: {
			"click .remove_a_book":"deleteBook" 
			// click a element having the class ".remove_a_book" will trigger this event
			// in the case that the object with specified class is inside the template.
		}
	});

	return BookView;
});
